﻿<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>组织部门详情</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- 注意：项目正式环境请勿引用该地址 -->
  <link href="//unpkg.com/layui@2.7.6/dist/css/layui.css" rel="stylesheet">
</head>
<body>

@*<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
  <legend>赋值和取值</legend>
</fieldset>*@

<form class="layui-form" action="" lay-filter="example">
<div class="layui-form-item">
    <label class="layui-form-label" style="font-weight:100">上级组织</label>
    <div class="layui-input-block">
        <input type="text" id="tree" lay-verify="title" autocomplete="off" placeholder="请选择上级" class="layui-input">
    </div>
</div>
  <div class="layui-form-item">
    <label class="layui-form-label">组织名称</label>
    <div class="layui-input-block">
      <input type="text" name="username" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">部门负责人</label>
    <div class="layui-input-block">
      <input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input">
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">启用</label>
    <div class="layui-input-block">
      <input type="checkbox" name="close" lay-skin="switch" lay-text="ON|OFF">
    </div>
  </div>

  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">文本域</label>
    <div class="layui-input-block">
      <textarea placeholder="请输入内容" class="layui-textarea" name="desc"></textarea>
    </div>
  </div>

  <div class="layui-form-item">
    <div class="layui-input-block">
@*      <button type="button" class="layui-btn layui-btn-normal" id="LAY-component-form-setval">新增</button>*@
      <button type="button" class="layui-btn layui-btn-normal" id="LAY-component-form-getval">修改</button>
      <button type="button" class="layui-btn layui-btn-normal" id="LAY-component-form-getval">删除</button>
      <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">保存</button>
    </div>
  </div>
</form>


<script src="~/layui/layui.js"></script>
<script>
    layui.use(['form', 'util', 'laydate'], function(){
      var form = layui.form;
      var layer = layui.layer;
      var util = layui.util;
      var laydate = layui.laydate;

      //日期
      laydate.render({
        elem: '#date'
      });
      laydate.render({
        elem: '#date1'
      });

      //自定义验证规则
      form.verify({
        title: function(value){
          if(value.length < 5){
            return '标题至少得5个字符啊';
          }
        }
        ,pass: [
          /^[\S]{6,12}$/
          ,'密码必须6到12位，且不能出现空格'
        ]
      });

      //指定开关事件
      form.on('switch(switchTest)', function(data){
        layer.msg('开关checked：'+ (this.checked ? 'true' : 'false'), {
          offset: '6px'
        });
        layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
      });

      //提交事件
      form.on('submit(demo1)', function(data){
        alert(JSON.stringify(data.field), {
          title: '最终的提交信息'
        })
        return false;
      });

      //表单赋值
      layui.$('#LAY-component-form-setval').on('click', function(){
        form.val('example', {
          "username": "贤心" // "name": "value"
          ,"password": "123456"
          ,"interest": 1
          ,"like[write]": true //复选框选中状态
          ,"close": true //开关状态
          ,"sex": "女"
          ,"desc": "我爱 layui"
        });
      });

      //表单取值
      layui.$('#LAY-component-form-getval').on('click', function(){
        var data = form.val('example');
        alert(JSON.stringify(data));
      });
      // 普通事件
      util.on('lay-on', {
        // 获取验证码
        "get-vercode": function(othis){
          var isvalid = form.validate('.demo-phone'); // v2.7.0 新增 
          // 验证通过
          if(isvalid){
            layer.msg('手机号验证通过，执行发送验证码的操作');
          }
        }
      });

    });
</script>

<script type="text/javascript">
    layui.config({
        base: "../js/"
    }).extend({
            treeSelect: "treeSelect/treeSelect"
    });

    layui.use(["treeSelect"], function () {
        var treeSelect = layui.treeSelect;
        treeSelect.render({
            // 选择器
            elem: '#tree',
            // 数据
            data: '../data3.json',
            // 异步加载方式：get/post，默认get
            type: 'get',
            // 占位符
            placeholder: '修改默认提示信息',
            // 是否开启搜索功能：true/false，默认false
            search: true,
            // 一些可定制的样式
            style: {
                folder: {
                    enable: true
                },
                line: {
                    enable: true
                }
            },
            // 点击回调
            click: function (d) {
                console.log(d);
            },
            // 加载完成后的回调函数
            success: function (d) {
                console.log(d);
                //                选中节点，根据id筛选
                treeSelect.checkNode('tree', 3);
                console.log($('#tree').val());
                //                获取zTree对象，可以调用zTree方法
                var treeObj = treeSelect.zTree('tree');
                console.log(treeObj);
                //                刷新树结构
                treeSelect.refresh('tree');
            }
        });
    });

    function getData() {
        var data = [];
        $.ajax({
            url: "/TreeData/getOrgInfo",    //后台数据请求地址
            type: "post",
            async: false,
            success: function (resut) {
                data = resut;
            }
        });
        return data;
    }
</script>
</body>
</html>